/*
 * @Author: your name
 * @Date: 2021-05-28 15:21:51
 * @LastEditTime: 2021-05-29 16:42:20
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /xiangpan-admin/src/pages/vipCard/index.tsx
 */
/*
 * @Author: your name
 * @Date: 2021-05-19 16:03:11
 * @LastEditTime: 2021-05-28 10:57:17
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /xiangpan-admin/src/pages/chain/index.tsx
 */
import { IForm } from '@/components/form/interface';
import { Button, Card, Modal, Space, Table, TablePaginationConfig } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import { useState } from 'react';
import React from 'react';
import EditModal from './editModal';
import initPagination from '@/use/initPagination';
import useObj from '@/use/useObj';
import { useRequest } from 'umi';
import { delete_store, get_store_list, get_vip_list } from '@/services/pages';
import { formatDateTime } from '../../utils/utils';
import { useEffect } from 'react';
interface IProps {}

const VipCard = (props: IProps) => {
  const [obj, setObj] = useObj({
    ...initPagination,
    visible: false,
    refresh: null,
    row: null,
  });

  const columns: IForm[] = [
    {
      key: 'vip_name',
      dataIndex: 'vip_name',
      title: '会员卡名称',
    },
    {
      key: 'vip_desc',
      dataIndex: 'vip_desc',
      title: '会员卡描述',
    },
    {
      key: 'create_time',
      dataIndex: 'create_time',
      title: '创建时间',
      render(text, record) {
        return formatDateTime(text);
      },
    },
    {
      key: 'opt',
      dataIndex: 'opt',
      title: '操作',
      render(text, record) {
        return (
          <Space>
            <Button
              type="primary"
              onClick={() => setObj({ row: record, visible: true })}
            >
              编辑
            </Button>
          </Space>
        );
      },
    },
  ];

  const { data, error, loading } = useRequest(
    () =>
      get_vip_list({
        page_size: obj.pagination.pageSize,
        page_num: obj.pagination.current,
      }),
    {
      refreshDeps: [obj.pagination, obj.refresh],
    },
  );

  useEffect(() => {
    setObj((obj) => {
      obj.pagination.total = data?.results[0]?.total || 0;
    });
  }, [data]);

  return (
    <Card title="会员卡">
      <Table
        loading={loading}
        columns={columns}
        dataSource={data?.results}
        pagination={obj.pagination}
        onChange={(pagination: TablePaginationConfig): void => {
          const { current, pageSize } = pagination;
          setObj((obj: any) => {
            obj.pagination.current = current;
            obj.pagination.pageSize = pageSize;
            obj.onReFresh = Symbol();
          });
        }}
      />
      {obj.visible && (
        <EditModal
          row={obj.row}
          visible={obj.visible}
          close={() => setObj({ visible: false })}
          refresh={() => {
            setObj((obj) => {
              obj.pagination.current = 1;
              obj.refresh = Symbol();
            });
          }}
        />
      )}
    </Card>
  );
};
export default VipCard;
